<template>
  <div :class="switchValue == '' ? 'home_dark' : 'home_' + switchValue ">
    <div class="second-page">
      <div class="wrap">
        <headerCom2 active="user"></headerCom2>
      </div>
      <div class="banner">
        <div class="wrap">
          <div class="banner-left-title">
            <p>个人中心</p>
          </div>
          <div class="banner-right-crumbs">
            <p>您的位置：首页 > 用户信息 > {{ curMenu }}</p>
          </div>
        </div>
      </div>
      <div class="main">
        <div class="wrap">
          <div class="left-module-box">
            <div class="user-msg-box">
              <div class="user-msg-toux">
                <el-image :src="headPic"></el-image>
              </div>
              <div class="user-msg-val">
                <p class="p1">{{ userInfo.userName }}</p>
                <p class="p2">{{ userInfo.orgName }}</p>
                <p class="p3">{{ userInfo.positionName }}</p>
              </div>
            </div>
            <!-- <div class="menu-box">
              <div
                :class="[
                  'menu-box-item ',
                  curMenu == '个人资料' ? 'cur-item' : 'a',
                ]"
                @click="curMenu = '个人资料'"
              >
                <p>个人资料</p>
              </div>
              <div
                :class="[
                  'menu-box-item ',
                  curMenu == '密码设置' ? 'cur-item' : 'a',
                ]"
                @click="curMenu = '密码设置'"
              >
                <p>密码设置</p>
              </div>
              <div
                :class="[
                  'menu-box-item ',
                  curMenu == '系统权限设置' ? 'cur-item' : 'a',
                ]"
                @click="curMenu = '系统权限设置'"
              >
                <p>系统权限设置</p>
              </div>
            </div> -->
          </div>
          <div class="right-module-box_fff">
            <div class="right-module-box">
              <div class="right_sitmsg">
                <div class="rightmsg-title-box">
                  <p>{{ curMenu }}</p>
                </div>
                <div  class="buttons">
                <el-button type="primary" @click="saveUserInfo">保存</el-button>
                <el-button @click="saveUserInfo">取消</el-button>
              </div>
              </div>
                <el-form
                  ref="userInfoForm"
                  v-if="curMenu === '个人基本信息'"
                  :model="userInfoForm"
                  class="info-form marL"
                  label-width="84px"
                >
                  <el-form-item label="姓名">
                    <el-input 
                     placeholder="请输入姓名"
                     v-model="userInfoForm.userName"></el-input>
                  </el-form-item>
                  <el-form-item label="手机号码">
                    <el-input 
                     placeholder="请输入手机号码"
                     v-model="userInfoForm.mobile"></el-input>
                  </el-form-item>
                  <el-form-item label="办公电话">
                    <el-input placeholder="请输入办公电话" v-model="userInfoForm.tel"></el-input>
                  </el-form-item>
                  <el-form-item label="岗位职责">
                    <span placeholder="请输入岗位职责" class="gwzz">{{userInfoForm.GWZZ}}</span>
                  </el-form-item>
              
                </el-form>
            </div>
            <div class="right-module-box">
              <div class="right_sitmsg">
                <div class="rightmsg-title-box">
                  <p>一体化基本信息</p>
                </div>
                <div  class="buttons">
                <el-button type="primary" @click="saveYthInfo">保存</el-button>
                <el-button  >取消</el-button>
              </div>
              </div>
                 <el-form
                    ref="userInfoForm"
                    :model="ythInfoForm"
                    class="info-form marL"
                    label-width="84px"
                  >
              <el-form-item label="账号">
                <el-input
                  :disabled="true"
                  placeholder="请输入账号"
                  v-model="ythInfoForm.YTHUSER"
                ></el-input>
              </el-form-item>
              <el-form-item label="姓名">
                <el-input
                  v-model="ythInfoForm.YTHNAME"
                  placeholder="请输入姓名"
                ></el-input>
              </el-form-item>
              <el-form-item label="身份证">
                <el-input
                  v-model="ythInfoForm.YTHSFZ"
                  placeholder="请输入身份证"
                ></el-input>
              </el-form-item>
              <el-form-item label="联系电话">
                <el-input
                  v-model="ythInfoForm.YTHKLXDH"
                   placeholder="请输入联系电话"
                ></el-input>
              </el-form-item>
            </el-form>
            </div>
            <div class="right-module-box">
              <div class="right_sitmsg">
                <div class="rightmsg-title-box">
                  <p>一张图办公门户密码设置</p>
                </div>
                <!-- <div  class="buttons">
                <el-button type="primary" @click="savePwdInfo">保存</el-button>
                <el-button  >取消</el-button>
              </div> -->
               <div  class="buttons">
                <el-button type="primary" @click="saveUserPic">保存签名</el-button>
                <el-button type="primary" @click="savePwdInfo">保存</el-button>
                <el-button  >取消</el-button>
              </div>
              </div>
                 <el-form
                    ref="userInfoForm"
                    :model="pwdInfoForm"
                    class="info-form marLd"
                    label-width="120px"
                  >
              <el-form-item label="用户登录名">
                <el-input
                  :disabled="true"
                  placeholder="请输入用户登录名"
                  v-model="userInfoForm.loginName"
                ></el-input>
              </el-form-item>
              <el-form-item label="输入旧密码">
                <el-input
                  v-model="pwdInfoForm.oldPwd"
                  placeholder="请输入旧密码"
                  :class="pwdErr?'errorInput':'succInput'"
                  type="password"
                  show-password
                ></el-input>
              </el-form-item>
              <el-form-item label="输入新密码">
                <el-input
                  v-model="pwdInfoForm.newPwd"
                  placeholder="请输入新密码"
                  type="password"
                  show-password
                ></el-input>
              </el-form-item>
              <el-form-item label="再次输入新密码">
                <el-input
                  v-model="RepeatNewPwd"
                  placeholder="请再次输入新密码"
                  type="password"
                  show-password
                ></el-input>
                <el-checkbox style="color:#fff;margin-left:.45rem;" v-model="signPwdIndependent"
                  >独立签名密码</el-checkbox
                >
              </el-form-item>
              <el-form-item label="签名密码" v-if="signPwdIndependent">
                <el-input
                  v-model="signPwd"
                  type="password"
                  show-password
                ></el-input>
              </el-form-item>
              <el-form-item label="签名图片">
                <el-image
                v-show="signPic"
                  :src="`http://172.18.2.232:8888${signPic}`"
                  style="width: 110px;height: 70px;"
                ></el-image>
                  
                <div v-show="!signPic">
                  <input
                    id="v-upload"
                    ref="upload"
                    type="file"
                    @change="signPigChange($event)"
                    :limit="1"
                    :accept="acceptValue"
                  />
                 <span class="style_dd">注：仅支持Png/jpg/gif格式，图片大于1M.</span>
                </div>
                  <el-button v-if="signPic" type="text" size="small" @click="updateSignPic()"
                  >更换图片</el-button>
              </el-form-item>
            </el-form>
            </div>
            <div class="right-module-box">
              <div class="right_sitmsg">
                <div class="rightmsg-title-box">
                  <p>系统权限设置</p>
                </div>
              </div>
              <div class='tsInfo'> 
                 <i class="el-icon-warning iconWarning"></i>
                为了方便您的后期使用，请及时设置系统权限信息。 请填写你需要使用的业务系统的用户名和密码；如果没有，请联系系统维护人员。 </div>
                 <el-table
              ref="systemPowerTable"
              :data="systemPowerTableData"
              class="table_sys marLe28"
              stripe
              fit
              highlight-current-row
              @row-click="systemPowerTableQuery"
            >
              <!-- <el-table-column
                type="index"
                label="序号"
                width="50"
                align="center"
              ></el-table-column> -->
              <el-table-column
                prop="LINKNAME"
                label="系统名称"
                width="200"
                :header-align="center"
                :show-overflow-tooltip="true"
              ></el-table-column>
              <el-table-column
                label="已绑定用户"
                :header-align="center"
                :align="center"
                :show-overflow-tooltip="true"
              >
                <template slot-scope="scope">
                  <div
                    style="color: rgba(50, 183, 104, 1);text-align: center"
                    v-if="scope.row.HASSET > 0"
                  >
                    是
                  </div>
                  <div style="color: rgba(222, 1, 1, 1);text-align: center" v-else>否</div>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                width="150"
                :align="center"
                :header-align="center"
                style="text-align:center"
              >
                <template slot-scope="scope">
                  <div
                    class="sq-btn"
                    v-if="scope.row.HASSET <= 0"
                    @click.native.prevent="applyUser(scope.row)"
                  >
                    <p>申请用户</p>
                  </div>
                  <div v-else style="wodth: 100%; text-align: center">
                    <p>已绑定</p>
                  </div>
                  <!-- <el-button
                    v-if="scope.row.HASSET <= 0"
                    type="text"
                    size="small"
                    @click.native.prevent="applyUser(scope.row)"
                    >申请用户</el-button
                  >
                  <span v-else>已绑定</span> -->
                </template>
              </el-table-column>
            </el-table>
            </div>
            
          </div>
        </div>
      </div>
      <el-dialog
        title="绑定用户"
        :visible.sync="showBindUser"
        :center="true"
        :modal="false"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        @close="closeBindUser"
      >
        <div>
          <el-form
            ref="bindUserForm"
            :model="bindUserForm"
            class="info-form"
            label-width="84px"
          >
            <el-form-item label="用户名">
              <el-input v-model="bindUserForm.loginName"></el-input>
            </el-form-item>
            <el-form-item label="密码">
              <el-input v-model="bindUserForm.pwd"></el-input>
            </el-form-item>
            <el-form-item style="text-align: center">
              <el-button type="primary" @click="saveUserBind">保存</el-button>
              <el-button @click="userBindCancel">取消</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-dialog>
      <footerCom></footerCom>
    </div>
  </div>
</template>

<script scoped>
import '@/utils/rem.js'
import footerCom from "./footerCom.vue"
import HeaderCom2 from './headerCom2.vue';
export default {
  name: "userInfo",
  props: {},
  components: {footerCom, HeaderCom2},
  computed: {},
  data() {
    return {
      showBindUser: false,
      index:false,
      pager: {
        pageIndex: 1,
        pageSizes: [10, 20, 30, 50],
        pageSize: 10,
        gotoPage: 1,
        total: 0,
      },
      acceptValue: ".jpg,.png,.jpeg",
      systemPowerTableData: [],
      loading: true,
      signPwdIndependent: false,
      pwdErr:false,
      signPwd: "",
      RepeatNewPwd: "",
      userInfo: {},
      bindUserForm: {
        loginName: "",
        pwd: "",
        linkId: "",
      },
      userInfoForm: {
        loginName: "",
        userName: "",
        orgName: "",
        departName: "",
        positionName: "",
        tel: "",
        mobile: "",
      },
      ythInfoForm:{

      },
      signPic: "",
      pwdInfoForm: {
        oldPwd: "",
        newPwd: "",
      },
      curMenu: "个人基本信息",
      userId: "2683",
      switchValue: 'dark',
      headPic:
        "http://172.18.3.11/mhoffice/MH/Theme/Images/mhsystem/%E5%A4%B4%E5%83%8F.png",
      systemPowerTable: [],
      loadingInstance: {},
    };
  },
  methods: {
    // 获取用户主题
    getUserStyle() {
      let that = this
      this.$.ajax({
        url: this.$API.ajaxPath,
        type: "post",
        data: {
          interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
          methodName: "getUserStyle",
          args: [localStorage.getItem("USER_ID")],
        },
        dataType: "json",
        success: (response) => {
          if (response.status == "0") {
            if (response.result == "1") {
              this.switchValue = "light";
            } else {
              this.switchValue = "dark";
            }
          }
        },
        error: (xhr) => {
          console.log(xhr);
        },
      });
    },
    saveUserBind() {
      let self = this;
      this.bindUserForm.loginName = this.bindUserForm.loginName.toUpperCase();
        this.$alert('这是一段内容', '标题名称', {
          confirmButtonText: '确定',
          callback: action => {
            self.$.ajax({
            url: self.$API.ajaxPath,
            type: "post",
            data: {
              interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
              methodName: "sytemPowerAlert",
              args: [
                localStorage.getItem("USER_ID"),
                JSON.stringify(this.bindUserForm),
              ],
            },
            dataType: "json",
            success: (response) => {
              console.log(response);
              if (response.status === "0") {
                self.$message.success("绑定成功!");
                this.showBindUser = false;
                this.systemPowerTableQuery();
              } else {
                self.$message.error(response.result);
              }
            },
            error: (xhr) => {
              console.log(xhr);
            },
          });
          }
        });
    },
    userBindCancel() {
      this.bindUserForm = {
        loginName: "",
        pwd: "",
        linkId: "",
      };
      this.showBindUser = false;
    },
    closeBindUser() {
      this.showBindUser = false;
    },
    clearFileList: function () {
      this.$("#v-upload").val(""); //清空选择的文件列表
    },
    openFullScreen() {
      this.loadingInstance = this.$loading({
        lock: true,
        text: "文件正在上传，请稍后……",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
    },
    closeFullScreen() {
      this.loadingInstance.close();
    },
    signPigChange(event) {
      //Loading加载实例
      console.log(121)
      let files = event.target.files;
      if (!files || files.length <= 0) return;
      this.openFullScreen();
      this.uploadFiles(files);
    },
    uploadFiles: function (files) {
      let self = this;
      let formData = new FormData();
      formData.append("token", this.token);
      //遍历文件列表加入formData
      for (let i = 0; i < files.length; i++) {
        formData.append("files", files[i]);
      }
      this.$.ajax({
        type: "post",
        url: "http://172.18.2.232:8888/portal/filesResourceUpload",
        data: formData,
        cache: false,
        processData: false,
        contentType: false,
        success: function (res) {
          self.closeFullScreen();
          if (res.status === "0") {
            let fileList = eval("(" + res.result + ")");
            self.signPic = fileList[0][0].filePath;
            console.log(self.signPic);
          } else {
            self.$alert(res.message, "系统提示", {
              confirmButtonText: "确定",
              type: "warning",
            });
          }
        },
        error: function (e) {
          self.closeFullScreen();
          self.$alert("上传失败", "系统提示", {
            confirmButtonText: "确定",
            type: " error",
          });
        },
      });
      this.clearFileList();
    },
    applyUser(row) {
      this.$confirm(
        "是否已拥有该子系统账号？如果有，选择绑定用户。如果没有，选择申请用户。",
        "申请系统用户",
        {
          distinguishCancelAndClose: true,
          confirmButtonText: "申请用户",
          cancelButtonText: "绑定用户",
        }
      )
        .then(() => {
          //申请用户
          this.$message({
            type: "info",
            message: "申请用户",
          });
        })
        .catch((action) => {
          //绑定用户
          this.bindUserForm.linkId = row.LINKID;
          this.showBindUser = true;
        });
    },
    handleSizeChange(val) {
      this.pager.pageSize = val;
      this.pager.gotoPage = 0;
      this.pager.pageIndex = 1;
      this.systemPowerTableQuery();
    },
    handleCurrentChange(val) {
      this.pager.pageIndex = val;
      this.systemPowerTableQuery();
    },
    systemPowerTableQuery() {
      this.loading = true;
      let self = this;
      let dbUrl = this.$API.ajaxPath;
      self.$.ajax({
        type: "POST",
        url: dbUrl,
        data: {
          interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
          methodName: "systemPowerSet",
          args: [localStorage.getItem("USER_ID")],
        },
        success: function (data) {
          if (!!data.result) {
            self.systemPowerTableData = eval("(" + data.result + ")");
          }
          self.loading = false;
        },
        error: function () {
          self.$alert("加载失败!", "系统提示", {
            confirmButtonText: "确定",
            type: "error",
          });
          self.loading = false;
        },
      });
    },
    updateSignPic() {
     document.getElementById("v-upload").click();

    },
    getSavePwdInfoJson() {
      let res = {
        oldPwd: this.$md5(this.pwdInfoForm.oldPwd),
        newPwd: this.$md5(this.pwdInfoForm.newPwd),
        signPwdIndependent: this.signPwdIndependent,
        signPwd: this.signPwd,
        signPic: this.signPic,
      };

      return JSON.stringify(res);
    },
    saveUserPic(){
      this.$.ajax({
        url: this.$API.ajaxPath,
        type: "post",
        data: {
          interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
          methodName: "updateSignaturePicture",
          args: [
            localStorage.getItem("USER_ID"),
            this.signPic,
          ],
        },
        dataType: "json",
        success: (response) => {
          console.log(response);
          if (response.status === "0") {
            this.$message.success('签名保存成功！')
          }
        },
        error: (xhr) => {
          console.log(xhr);
        },
      })
    },
    checkPwd (){
      this.$.ajax({
            url: this.$API.ajaxPath,
            type: "post",
            data: {
              interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
              methodName: "alertUserPwd",
              args: [
                localStorage.getItem("USER_ID"),
                this.$md5(this.pwdInfoForm.oldPwd),
              ],
            },
            dataType: "json",
            success: (response) => {
              console.log(response);
              if (response.status === "0") {
                this.pwdErr = false
              }else{
                this.pwdErr = true
              }
            },
            error: (xhr) => {
              console.log(xhr);
            },
      })
    },
    savePwdInfo() {
      let self = this;
      if (!this.pwdInfoForm.oldPwd || !this.pwdInfoForm.newPwd) {
        this.$message.warning("请先填写密码信息再修改!");
        return;
      }
      if (this.RepeatNewPwd !== this.pwdInfoForm.newPwd) {
        this.$message.error("两次新密码输入不同!!");
        return;
      }
      // if(this.pwdErr){
      //   this.$message.error("旧密码错误，请修改后再试");
      //   return;
      // }
      // this.$confirm("确认保存？").then(() => {
      //     self.$.ajax({
      //       url: self.$API.ajaxPath,
      //       type: "post",
      //       data: {
      //         interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
      //         methodName: "alertUserPwd",
      //         args: [
      //           localStorage.getItem("USER_ID"),
      //           self.getSavePwdInfoJson(),
      //         ],
      //       },
      //       dataType: "json",
      //       success: (response) => {
      //         console.log(response);
      //         if (response.status === "0") {
      //           self.$message.success("修改成功!");
      //           this.pwdErr =false
      //         } else {
      //           self.$message.error(response.result);
      //           if(response.result=='错误的旧密码!'){
      //             this.pwdErr = true
      //           }
      //         }
      //       },
      //       error: (xhr) => {
      //         console.log(xhr);
      //       },
      //     });
      //   })
      //   .catch((_) => {
      //     console.log(_);
      //   });
        // this.$alert('确认保存？',{
        //   confirmButtonText: '确定',
        // }).then(() => {
        //   self.$.ajax({
        //     url: self.$API.ajaxPath,
        //     type: "post",
        //     data: {
        //       interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
        //       methodName: "alertUserPwd",
        //       args: [
        //         localStorage.getItem("USER_ID"),
        //         self.getSavePwdInfoJson(),
        //       ],
        //     },
        //     dataType: "json",
        //     success: (response) => {
        //       console.log(response);
        //       if (response.status === "0") {
        //         self.$message.success("修改成功!");
        //         this.pwdErr =false
        //       } else {
        //         self.$message.error(response.result);
        //         if(response.result=='错误的旧密码!'){
        //           this.pwdErr = true
        //         }
        //       }
        //     },
        //     error: (xhr) => {
        //       console.log(xhr);
        //     },
        //   });
        // }).catch(() => {
        //   this.$message({
        //     type: 'info',
        //     message: '已取消修改'
        //   });          
        // });
        this.$alert('确认保存？', {
          confirmButtonText: '确定',
          callback: action => {
          self.$.ajax({
            url: self.$API.ajaxPath,
            type: "post",
            data: {
              interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
              methodName: "alertUserPwd",
              args: [
                localStorage.getItem("USER_ID"),
                self.getSavePwdInfoJson(),
              ],
            },
            dataType: "json",
            success: (response) => {
              console.log(response);
              if (response.status === "0") {
                self.$message.success("修改成功!");
                this.pwdErr =false
              } else {
                self.$message.error(response.result);
                if(response.result=='错误的旧密码!'){
                  this.pwdErr = true
                }
              }
            },
            error: (xhr) => {
              console.log(xhr);
            },
          });
          }
        });
    },
    saveUserInfo() {
      let self = this;
      this.$alert('确认保存？', {
          confirmButtonText: '确定',
          callback: action => {
            self.$.ajax({
              url: self.$API.ajaxPath,
              type: "post",
              data: {
                interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
                methodName: "userInfoAlert",
                args: [
                  localStorage.getItem("USER_ID"),
                  JSON.stringify(self.userInfo),
                ],
              },
              dataType: "json",
              success: (response) => {
                console.log(response);
                if (response.status === "0") {
                  self.$message.success("修改成功!");
                }
              },
              error: (xhr) => {
                console.log(xhr);
              },
            });
          }
        });
    },
    getUserInfo() {
      this.$.ajax({
        url: this.$API.ajaxPath,
        type: "post",
        data: {
          interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
          methodName: "getUserInfo",
          args: [localStorage.getItem("USER_ID")],
        },
        dataType: "json",
        success: (response) => {
          console.log(response);
          if (response.status === "0") {
            response.result = JSON.parse(response.result);
            this.userInfo = response.result;
            this.userInfoForm = response.result;
            this.signPic = `${this.userInfo.signPic}`;
          }
        },
        error: (xhr) => {
          console.log(xhr);
        },
      });
    },
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    // 一体化信息
    saveYthInfo() {
       let self = this;
       this.$alert('确认保存？', {
          confirmButtonText: '确定',
          callback: action => {
           self.$.ajax({
            url: self.$API.ajaxPath,
            type: "post",
            data: {
              interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
              methodName: "ythInfoAlert",
              args: [
                localStorage.getItem("USER_ID"),
                JSON.stringify(self.ythInfoForm),
              ],
            },
            dataType: "json",
            success: (response) => {
              console.log(response);
              if (response.status === "0") {
                self.$message.success("修改成功!");
              }
            },
            error: (xhr) => {
              console.log(xhr);
            },
          });
            }
          });
    },
     getYthInfo() {
      this.$.ajax({
        url: this.$API.ajaxPath,
        type: "post",
        data: {
          interfaceName: "antu.newportal-zjx.provider.user.UserProvider",
          methodName: "getYthInfo",
          args: [localStorage.getItem("USER_ID")],
        },
        dataType: "json",
        success: (response) => {
          if (response.status === "0") {
            response.result = JSON.parse(response.result);
            this.ythInfoForm = response.result;
            console.log(this.ythInfoForm,'this.ythInfoForm')
          }else{
            this.ythInfoForm = {};
          }
        },
        error: (xhr) => {
          console.log(xhr);
        },
      });
    },
  },
  mounted() {
    document.documentElement.scrollTop = document.body.scrollTop = 0;
  },
  created() {
    this.getYthInfo();
    // 获取用户所选主题
    this.getUserStyle();
    this.getUserInfo();
    this.systemPowerTableQuery();

  },
};
</script>
<style lang="less">
.second-page {
  .el-table td, .el-table th.is-leaf {
    border-bottom: 0 !important;
  }
  .el-table {
          background-color: transparent !important;
          color: #ffffffff;
        }
        .el-table::before{
          width: 0;
        }
        .el-table th,
        .el-table tr,
        .el-table td {
          background-color: transparent !important;
          color: #666666;
        }
        .el-table td{
           border-bottom: 1px dashed rgba(56, 196, 219, 0.2) !important;
        }
        .el-table th.is-leaf{
          border-bottom: 1px dashed rgba(56, 196, 219, 0.2) !important;
        }
        .el-table__empty-text {
          color: rgb(183, 225, 243);
        }
}
.el-image__inner--center{
  top: 0!important;
  left: 0!important;
  transform: none!important;
}
</style>
<style lang="less" scoped>
@import "./css/light.less";
@import "./css/dark.less";
@import "./css/userInfo.less";

//二级页面
.home_dark .second-page {
  & /deep/ .el-table th {
    text-align: center;
  }

  .main {
    min-height: 60vh;
  }


  .header-right-box {
    display: flex;
    align-items: center;
  }
  .main .wrap {
    display: flex;
    margin:0 !important;

  }



  .menu-box {
    background-color: rgba(244, 249, 255, 1);
  }

  .menu-box-item {
    height: 60px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    padding-left: 30px;
    background-color: rgba(54, 112, 255, 0.1);
    transition: all 0.3s;
    border-left: 2px rgba(24, 110, 205, 0) solid;
    cursor: pointer;

    p {
      font-size: 16px;
    }
  }

  .menu-box-item.cur-item {
    background-color: rgba(54, 112, 255, 0.4);
    color: rgba(54, 112, 255, 1);
    border-left: 2px rgba(24, 110, 205, 1) solid;
  }

  .msg-box {
    width: 60%;
    margin: 0 auto;
    padding: 30px 0 0;
  }

  .msg-box-item {
    display: flex;
    align-items: center;

    p:first-of-type {
      width: 120px;
      color: rgba(80, 80, 80, 1);
      font-size: 14px;
    }

    p:last-of-type {
      color: rgba(80, 80, 80, 1);
      font-size: 14px;
    }
  }
  .sq-btn {
    width: 120px;
    height: 38px;
    line-height: 38px;
    color: rgba(54, 112, 255, 1);
    background-color: rgba(235, 241, 255, 1);
    font-size: 12px;
    text-align: center;
    cursor: pointer;
    margin: 0 auto;
  }
}
.home_light .second-page {
  .el-table td, .el-table th.is-leaf {
    border-bottom: 0 !important;
  }
  .el-table {
          background-color: transparent !important;
          color: #333333;
        }
        .el-table::before{
          width: 0;
        }
        .el-table th,
        .el-table tr,
        .el-table td {
          background-color: transparent !important;
          color: #333333;
        }
        .el-table td{
           border-bottom: 1px dashed rgba(56, 196, 219, 0.2) !important;
        }
        .el-table th.is-leaf{
          border-bottom: 1px dashed rgba(56, 196, 219, 0.2) !important;
        }
        .el-table__empty-text {
          color: rgb(183, 225, 243);
        }
}
.wrap{
  display: flex;
}
.home_light .el-table th, .el-table tr{
  color: #333333!important;
}
.errorInput{
    border: 1px solid red;
    border-radius: 5px;
}
.succInput{
    border: 1px solid #DCDFE6;
    border-radius: 5px;
}
.header-right-box{
  display: flex;
}
</style>
